<div class='vsep'>2</div>
<div class="column">
	<h2>Envía SMS/MMS a tus contactos.</h2>
	 <p>Destinatarios. <span class="small">Pulsa sobre tus contactos en el menú izquierdo.</span> </p>

	<div class='step'>
		<div id="destinos" class="contacts"></div>
		
		<% form_remote_tag (:url => { :action => :sendsms }, :html => {:target=>'upload_frame',:id => 'envio' ,:multipart => true}) do%>
			<%=hidden_field_tag :mtSms%>
			<%=hidden_field_tag :mms%>
			<p>Mensaje. <span class="small"><strong>160</strong> caracteres disponibles.</span> </p>

			
			<%=text_area(:text, nil, :id => "text_",:rows=>3,:class=>"txtarea msg")%><br/>
			<p>Archivos Multimedia. <span class="small">Fotos, videos o audios.</span> </p></p>

			<%=file_field 'upload', 'datafile' ,:onChange=>"javascript:fileChange(this)"%>
			<div id="links">
				<a href="#" onclick="sendSMS(); return false;">
					<%=image_tag("sms.jpg",:id=>"smsImg",:class=>"inactive")%>
				</a>
				<a href="#" onclick="sendMMS();">
					<%=image_tag("mms.jpg",:id=>"mmsImg",:class=>"inactive")%>
				</a>
				
			</div>
			<div id="result"></div>
	<%end%>
	<iframe id="upload_frame" name="upload_frame" style="display:none"></iframe>
	
	</div>
</div>
<script language="javascript">
	var mo = '<%=@result["number"] unless @result.nil?%>';
	var mo = '<%=@mo if @result.nil?%>';
	$("smsImg").setStyle("opacity: 0.4");
	$("mmsImg").setStyle("opacity: 0.4");
	var destinos=new Array();
	
	function fileChange(upload_field){
		var re_text = /\.gif|\.jpg|\.png/i;
	    var filename = upload_field.value;
	
	    /* Checking file type */
	    if (filename.search(re_text) == -1)
	    {
	        alert("Porfavor, seleccione una imagen válida. ");
	        upload_field.form.reset();
	        return false;
			
	    }
		
	    
	}
	function addContact(mt, name)
	{
		if(destinos.indexOf(mt) != -1)
		{
			return;
		}
		$("destinos").update($("destinos").innerHTML+"<div class='numero' id='"+mt+"' onClick='javascript:del(\""+mt+"\")'>"+name+"</div>");
		destinos.push(mt);
		checkCount();
	}
	
	function sendSMS()
	{
		if (destinos.length < 1) {
			return;
		}
		$('result').update("Sending message...");
		$('mtSms').value = destinos.join(';');
		$('mms').value=0;
		$('envio').onsubmit();
		setTimeout(function(){$('result').update("Message sent!");},5000);
	}
	
	function sendMMS()
	{
		if (destinos.length < 1) {
			return;
		}
		$('result').update("Sending message...");
		$('mtSms').value = destinos.join(';');
		$('mms').value=1;
		$('upload_datafile').form.submit();
		setTimeout(function(){$('result').update("Message sent!");},6000);
		
	}
	function del(mt)
	{
		$(mt).remove();
		destinos=destinos.without(mt);	
		checkCount();
	}
	function checkCount()
	{
		if(destinos.length>=1)
		{
				$("mmsImg").setStyle("opacity: 1");
				$("smsImg").setStyle("opacity: 1");
			
		}else{
			$("smsImg").setStyle("opacity: 0.4");
			$("mmsImg").setStyle("opacity: 0.4");
		}
		
		
	}
</script>

